<template>
	<view class="collect">
<!-- 		<view class="loading" style="position: relative; width: 750rpx;height: 100vh;text-align: center;" v-if="isLoading">
			<view class="text position-center" style="width: 750rpx;">
				{{ loadingTitle }}
			</view>
		</view> -->
		<view class="title">乐谱收藏</view>  
		    <view class="sheet-list">  
		      <view v-for="(sheet, index) in sheets" :key="index" class="sheet-item" @tap="collectSheet(sheet.id, sheet.collected)">  
		        <text>{{ sheet.title }}</text>  
		        <text v-if="sheet.collected">已收藏</text>  
		    </view>  
	    </view>
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		},
		  mounted() {  
		    // 假设从本地存储读取已收藏的乐谱  
		    const savedSheets = uni.getStorageSync('sheets');  
		    if (savedSheets) {  
		      this.sheets = JSON.parse(savedSheets);  
		    }  
		  } 
	}
</script>

<style>
	.collect {  
	  padding: 20px;  
	}  
	.title {  
	  font-size: 20px;  
	  font-weight: bold;  
	  margin-bottom: 15px;  
	}  
	.sheet-list {  
	  display: flex;  
	  flex-direction: column;  
	}  
	.sheet-item {  
	  margin-bottom: 10px;  
	  padding: 10px;  
	  background-color: #f0f0f0;  
	  border-radius: 5px;  
	}  
	.sheet-item text {  
	  display: block;  
	} 
	

</style>
